'use client'
import React, { useEffect, useState } from 'react';
import { Table, Button, Input, message } from 'antd';

import axios from 'axios';
import colum from '@/(configure)/colum';
import './page.css'; // 引入样式文件
export default function Page() {

  const [valuenae,setvaluname]=useState('')
 
  const [bz,setbz]=useState('')
  const [fetdata,setfetdata]=useState([])
  //用户注册
  const registryo = ()=>{
   axios.post('api/reg',{
      name:valuenae,
      colum:"姚乐姚",
      bz:bz,
   }).then(res=>{
      console.log(res.data.message)
      const resultdata =res.data.message
      if(resultdata=='插入成功'){
      alert('注册成功')
       window.location.reload()
      }
      if(resultdata=='插入失败'){
        alert('注册失败')
      }
   })
  }

  useEffect(() => {
    // 设置定时器每秒更新一次日期10秒
    const intervalId = setInterval(() => {
      axios
        .get("/api/fetdata")
        .then((res) => {
          setfetdata(res.data)
        })
        .catch((error) => {
          console.error("Error fetching data:", error);
        });
    }, 10000);

    // 清除定时器
    return () => clearInterval(intervalId);
  }, []);
 

  return (
    <div>
      <div className="title-container">
        <div>北京中企银泰</div>
      </div>
      <div className="input-button-container">
        <label>pi名字:</label>
        <Input className="custom-input"  value={valuenae} onChange={(e)=>{setvaluname(e.target.value)}}/>
        <label>分组:</label>
        <Input className="custom-input"  value={bz}  onChange={(e)=>{setbz(e.target.value)}} />
        <Button type="primary" onClick={registryo}>用户注册</Button>
      </div>
      <Table columns={colum}  dataSource={fetdata}/>
    </div>
  );
}